<script setup>
import { reactive, ref,onMounted } from "vue";
import Dialog from "@/components/Dialog.vue";
import { useUserStore } from "@/stores/user";
import { getCqData_byyx } from "@/api/stud";
import Bar from "./bar.vue"

const props = defineProps(["visible", "title"]);

const emits = defineEmits(["close", "details"]);

const dataStore = useUserStore();


const list = ref([]);
const barData=ref([]);
const barXData = ref([]);
const getData=async ()=>{
  await getCqData_byyx().then((res)=>{
    let total=res.data.total
    let arr1=[]
    let arr2=[]
    arr1.push(total['196013'].name)
    arr2.push(total['196013'].count)
    arr1.push(total['196014'].name)
    arr2.push(total['196014'].count)
    arr1.push(total['196015'].name)
    arr2.push(total['196015'].count)
    arr1.push(total['196016'].name)
    arr2.push(total['196016'].count)
    arr1.push(total['196017'].name)
    arr2.push(total['196017'].count)
    arr1.push(total['196018'].name)
    arr2.push(total['196018'].count)
    arr1.push(total['196019'].name)
    arr2.push(total['196019'].count)
    barData.value=arr2
    barXData.value=arr1
  })
}


</script>

<template>
  <Dialog
    :visible="props.visible"
    :title="props.title"
    size="default"
    @close="
      () => {
        emits('close');
        activeTab = '高校';
        currentPage = 1;
        search = '';
      }
    "
    @open="getData"
  >
    <div class="box">
      <Bar :data="barData" :x="barXData"></Bar>
    </div>
  </Dialog>
</template>

<style lang="less" scoped>
.box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 44px 50px 0 50px;
}
</style>
